<template>
    <div class="container">
        <div class="clearfix">
            <span>模板配置页</span>
            <span class="r">
        <!--<el-button class="pan-btn green-btn sm-btn" size="small" v-if="msgInfoStatus == 0">发布</el-button>-->
                <!--<el-button class="pan-btn red-btn sm-btn" size="small">删除</el-button>-->
        <el-button class="r pan-btn green-btn sm-btn"
                   size="small"
                   icon="el-icon-refresh"
                   @click="refresh"></el-button>
      </span>
        </div>
        <div class="con clearfix">
            <div class="con-left l">
                <el-tabs v-model="pageModel"
                         type="card"
                         @tab-click="handleClick">
                    <el-tab-pane label="信息编辑"
                                 name="msgEdit">
                        <msgEdit v-bind:json="json"
                                 v-on:listenMsgEdit="MsgEditData"></msgEdit>
                    </el-tab-pane>
                    <el-tab-pane label="条件设置"
                                 v-if="hideSetFlag"
                                 name="condtion">
                        <condition v-bind:json="json"></condition>
                    </el-tab-pane>
                    <el-tab-pane label="奖品设置"
                                 v-if="hideSetFlag"
                                 name="prizeSet">
                        <prizeModel v-on:listenPrizeEdit="prizeListEdit"
                                    v-bind:json="json"></prizeModel>
                    </el-tab-pane>
                    <el-tab-pane label="高级设置"
                                 v-if="hideSetFlag"
                                 name="seniorSet">
                        <seniorSet v-bind:json="json"></seniorSet>
                    </el-tab-pane>
                    <el-tab-pane label="奖品列表"
                                 v-if="hideSetFlag"
                                 name="prizeList">
                        <prizeList v-on:listenPrizeEdit="prizeListEdit"
                                   v-bind:json="json"></prizeList>
                    </el-tab-pane>
                    <el-tab-pane label="微信设置" v-if="hideSetFlag" name="wechatConfig">
                        <wechatConfig v-bind:json="json"></wechatConfig>
                    </el-tab-pane>
                </el-tabs>
            </div>
            <div class="con-right r"></div>
        </div>
    </div>
</template>
<script>
    import {param2Obj} from '@/utils/index'
    import msgEdit from '@/views/components/template-components/msgEdit'
    import condition from '@/views/components/template-components/condition'
    import prizeModel from '@/views/components/template-components/prizeModel'
    import seniorSet from '@/views/components/template-components/seniorSet'
    import prizeList from '@/views/components/template-components/prizeList'
    import wechatConfig from '@/views/components/template-components/wechatConfig';

    export default {
        name: 'eggtwisting',
        data() {
            return {
                hideSetFlag: false,
                msgInfoStatus: null,
                modelName: '',
                pageModel: 'msgEdit',
                json: { // /////////用于子组件获取数据
                    activityId: '',
                    templateId: '',
                    pageModel: 'msgEdit',
                    prizeId: '',
                    editFlag: false,
                    templateMark: ''
                }
            }
        },
        props: ['templateMark'],
        mounted() {
            this.modelName = param2Obj(window.location.href).name;
            this.json.templateId = param2Obj(window.location.href).templateId;
            this.json.activityId = param2Obj(window.location.href).activityId;
            this.json.prizeId = param2Obj(window.location.href).prizeId;
            this.json.editFlag = param2Obj(window.location.href).editFlag;
            this.json.templateMark = param2Obj(window.location.href).type;
            console.log('---->'+this.json.templateMark)
        },
        components: {
            msgEdit,
            condition,
            prizeModel,
            seniorSet,
            prizeList,
            wechatConfig,
        },
        methods: {
            handleClick(tab, event) {
                // console.log(tab, event);
                this.json.pageModel = tab.name
                /*
                * 奖品 tab 切换
                * 奖品配置内容一样  即  form  提交一样 内容一样
                * */
            },
            MsgEditData(data) {
                this.hideSetFlag = data.hideSetFlag;
                this.json.activityId = data.activityId;
                this.pageModel = data.pageModel;
                this.json.pageModel = data.pageModel
            },
            prizeListEdit(data) {
                this.pageModel = data.pageModel;
                this.json.prizeId = data.prizeId;
                this.hideSetFlag = data.hideSetFlag;
                this.json.pageModel = 'prizeSet'
            },
            refresh() {
                this.$router.go(0)
            }
        }
    }
</script>
<style>
    .inline-form .el-form-item__content {
        width: 210px;
    }

    .img-label .el-form-item__content {
        width: 500px;
    }

    .con-left {
        width: 70%;
    }

    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }

    .avatar-uploader .el-upload:hover {
        border-color: #409eff;
    }

    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }

    .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }
</style>
